<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:w="http://wiki">

<ui:composition template="/WEB-INF/template/templateSupervisor.xhtml">

	<ui:define name="content">
		<f:view locale="#{language.locale}">
			<f:loadBundle basename="properties.messages" var="msg" />
			<h:form id="userForm">
				<h:outputScript library="js" name="tags.js" target="head" />
				<h:commandLink styleClass="refreshButton"
					action="#{userController.refreshRepository}">
					<f:ajax execute="@this" render="@form" />
				</h:commandLink>

				<h:panelGroup layout="block" styleClass="tree">
					<w:tree flist="#{userController.folderz}"
						rlist="#{userController.resourcez}" id="tree"
						value="#{userController.selected}" repository="#{repositoryDTO}">
						<f:ajax render="@form" event="click"></f:ajax>
					</w:tree>

				</h:panelGroup>


				<h:panelGroup layout="block" styleClass="treeContent"
					id="treeContent">

					<h:panelGroup styleClass="treeSubMenuResource"
						rendered="#{userController.resourceRender}">
						<center>
							<ul id="menu-bar" class="treeMenu">
								<li><h:commandButton value="#{msg.edit}"
										rendered="#{userController.selected.lockerId == 1}"
										action="#{userController.editContent()}">
										<f:ajax render="treeContent" execute="@this"></f:ajax>
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.viewHistory}"
										action="#{userController.viewHistory}">
										<f:ajax execute="@this historyTable" render="treeContent"></f:ajax>
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.requestUnlockResource}"
										rendered="#{userController.selected.lockerId != 1 and !userController.supervisor}"
										action="#{userController.sendUnlockRequest}">
										<f:ajax execute="@this requestMessage" />
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.requestDeleteResource}"
										action="#{userController.sendDeleteRequest}"
										rendered="#{!userController.supervisor}">
										<f:ajax execute="@this requestMessage" render="treeContent" />
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.unlock_resource}"
										rendered="#{userController.selected.lockerId != 1 and userController.supervisor}"
										action="#{userController.unlockResource}">
										<f:ajax execute="@this requestMessage"
											render="requestMessage @form" />
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.delete_resource}"
										action="#{userController.deleteResource}"
										rendered="#{userController.supervisor}">
										<f:ajax execute="@this requestMessage"
											render="treeContent @form" />
									</h:commandButton></li>
							</ul>
						</center>
						<h:outputText value="#{msg.requestSentToSup}"
							rendered="#{userController.sent}" id="requestMessage"
							style="color:green" />
						<h:panelGroup styleClass="treeContentArea" style="display:block;"
							layout="block">
							<h:panelGrid border="0" columns="1">
								<h:outputLabel value="#{msg.content}:" />
								<h:outputText value="#{userController.selected.content}"
									rendered="#{userController.operation != 'MODIFY'}"
									escape="false"></h:outputText>
							</h:panelGrid>
							<h:panelGroup layout="block"
								rendered="#{userController.operation == 'MODIFY'}">
								<h:panelGrid border="0" columns="7">
									<h:commandButton value="B"
										styleClass="selectRepositoryButtonSlim">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'bold') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="I"
										styleClass="selectRepositoryButtonSlim">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'italic') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="U"
										styleClass="selectRepositoryButtonSlim">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'underline') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="Header1"
										styleClass="selectRepositoryButton">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'header1') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="Header2"
										styleClass="selectRepositoryButton">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'header2') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="Header3"
										styleClass="selectRepositoryButton">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'header3') }"
											render="preview" />
									</h:commandButton>
									<h:commandButton value="Paragraph"
										styleClass="selectRepositoryButton">
										<f:ajax execute="inputTextArea preview @this"
											onevent="function(data) { addTag(data, 'paragraph') }"
											render="preview" />
									</h:commandButton>

								</h:panelGrid>


							</h:panelGroup>
							<h:panelGroup layout="block"
								rendered="#{userController.operation == 'HISTORY' and userController.notEmptyHistory}"
								id="historyTable">
								<br />
								<br />
								<h:dataTable cellpadding="10em" styleClass="order-table-history"
									headerClass="order-table-header"
									rowClasses="order-table-odd-row,order-table-even-row"
									columnClasses="order-table-column"
									value="#{userController.historyz}" var="h">
									<h:column headerClass="leftHead">
										<f:facet name="header">#{msg.date}</f:facet>
								#{h.formattedDate}
							</h:column>
									<h:column>
										<f:facet name="header">#{msg.description}</f:facet>
								#{h.description}
							</h:column>
									<h:column>
										<f:facet name="header">#{msg.type}</f:facet>
								#{msg[h.type]}
							</h:column>
									<h:column headerClass="rightHead">
										<f:facet name="header">#{msg.author}</f:facet>
								#{h.authorStr}
							</h:column>
								</h:dataTable>
							</h:panelGroup>
						</h:panelGroup>
						<br />
						<br />
						<h:outputText value="#{msg.noHistory}"
							rendered="#{userController.operation == 'HISTORY' and !userController.notEmptyHistory}"></h:outputText>
					</h:panelGroup>



					<h:panelGroup styleClass="treeSubMenuFolder"
						rendered="#{userController.folderRender or userController.repositoryRender}">
						<center>
							<ul id="menu-bar" class="treeMenu">
								<li><h:commandButton value="#{msg.newResource}"
										action="#{userController.createResource()}"
										rendered="#{userController.folderRender}">
										<f:ajax render="treeContent" execute="@this"></f:ajax>
									</h:commandButton></li>
								<li><h:commandButton value="#{msg.newFolder}"
										action="#{userController.createFolder}">
										<f:ajax render="treeContent" execute="@this"></f:ajax>
									</h:commandButton></li>
							</ul>
						</center>
						<h:panelGroup
							rendered="#{userController.operation == 'CREATE_RES'}"
							styleClass="treeCreate" id="newResourceCreate" layout="block">
							<h:panelGrid>

								<h:panelGroup layout="block"
									rendered="#{userController.operation == 'CREATE_RES'}">
									<h:panelGrid border="0" columns="7">
										<h:commandButton value="B"
											styleClass="selectRepositoryButtonSlim">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'bold') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="I"
											styleClass="selectRepositoryButtonSlim">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'italic') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="U"
											styleClass="selectRepositoryButtonSlim">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'underline') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="Header1"
											styleClass="selectRepositoryButton">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'header1') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="Header2"
											styleClass="selectRepositoryButton">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'header2') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="Header3"
											styleClass="selectRepositoryButton">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'header3') }"
												render="preview" />
										</h:commandButton>
										<h:commandButton value="Paragraph"
											styleClass="selectRepositoryButton">
											<f:ajax execute="inputTextArea preview @this"
												onevent="function(data) { addTag(data, 'paragraph') }"
												render="preview" />
										</h:commandButton>

									</h:panelGrid>


								</h:panelGroup>




							</h:panelGrid>
						</h:panelGroup>

						<h:panelGroup
							rendered="#{userController.operation == 'CREATE_FOL'}"
							id="newFolder" layout="block">
							<br />
							<h:outputText value="#{msg.name}:" />
							<h:inputText value="#{userController.name}" id="folnameId"
								validator="#{userController.validateFolderName}">
								<f:ajax event="blur" execute="@this" render="folnameError" />
							</h:inputText>
							<br />
							<br />
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.createButton}"
								action="#{userController.submitFolder}">
								<f:ajax render="@form" execute="@this newFolder" />
							</h:commandButton>
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.cancel}" action="#{userController.cancel}" />
							<h:message for="folnameId" id="folnameError"
								style="color:red;display:block;" />
						</h:panelGroup>
					</h:panelGroup>

					<h:panelGroup
						rendered="#{userController.operation == 'MODIFY' or userController.operation == 'CREATE_RES'}">
						<h:outputText value="#{msg.name}:"
							rendered="#{userController.operation == 'CREATE_RES'}" />
						<h:inputText value="#{userController.name}" id="resnameId"
							validator="#{userController.validateResourceName}"
							rendered="#{userController.operation == 'CREATE_RES'}">
							<f:ajax event="blur" execute="@this" render="resnameError" />
						</h:inputText>
						<h:message for="resnameId" id="resnameError"></h:message>

						<h:panelGrid columns="2">

							<h:outputText value="#{msg.content}" />
							<h:outputText value="#{msg.preview}" />
							<h:inputTextarea styleClass="editFile"
								value="#{userController.content}" id="inputTextArea"
								validator="#{userController.validateContentArea}">
								<f:ajax event="keyup" execute="preview @this" render="preview" />
							</h:inputTextarea>

							<h:outputText styleClass="contentFile"
								value="#{userController.content}" id="preview" escape="false" />

							<h:message for="inputTextArea" id="textAreaError"
								style="color:red;"></h:message>
						</h:panelGrid>
						<h:panelGroup rendered="#{userController.operation == 'MODIFY'}">
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.submit}"
								action="#{userController.submitNewContent()}">
								<f:ajax render="treeContent textAreaError"
									execute="@this inputTextArea" />
							</h:commandButton>
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.cancel}" action="#{userController.cancelModify}">
								<f:ajax render="treeContent" execute="@this" />
							</h:commandButton>
						</h:panelGroup>
						<h:panelGroup
							rendered="#{userController.operation == 'CREATE_RES'}">
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.submit}"
								action="#{userController.submitResource()}">
								<f:ajax render="@form" execute="@this newResourceCreate"></f:ajax>
							</h:commandButton>
							<h:commandButton styleClass="selectRepositoryButton"
								value="#{msg.cancel}" action="#{userController.cancel}">
							</h:commandButton>
						</h:panelGroup>

					</h:panelGroup>

				</h:panelGroup>

			</h:form>
		</f:view>
	</ui:define>

</ui:composition>
</html>